html{
  body {
    overflow: hidden;
    .success-msg {
      color: #5cb85c;
    }


    .user-mask {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      background: rgba(255,255,255,.1);
      display: none;
      z-index: 10;
    }
    .content {
      position: absolute;
      margin: 0;
      top: 37px;
      left: 15%;
      overflow: hidden;
      bottom: 0;
      .page-inner {
        .item-header {
          margin-bottom: 10px;
          padding-left: 20px;
          padding-right: 10px;
          height: 40px;
          background: #fff;
          padding-top: 5px;
          box-sizing: border-box;
          .search-box {
            display: inline-block;
            vertical-align: middle;
            position: relative;
            .search-input-border {
              height: 20px;
              border-right: solid 1px #dee6ea;
              position: absolute;
              top: 5px;
              right: -15px;
            }
            .search-icon {
              background: url("../images/search-icon.png") no-repeat;
              width: 16px;
              height: 16px;
              position: absolute;
              top: 7px;
              right: 0;
              cursor: pointer;
            }
            input {
              height: 29px;
              border: 0;
              outline: none;
              width: 150px;
            }
          }
          .item-right {
            float: right;
            .add-user-btn {
              background:#03a9f4;
              border-radius:4px;
              width:78px;
              height:29px;
              border: 0;
              color: #fff;
              cursor: pointer;
              outline: none;
              &:hover{
                background: #66bb6a;
              }
            }
          }
          &:after{
            clear: both;
          }
        }
        .item-content {
          border: 0;
          min-height: 480px;
          margin-bottom: 20px;
          .table-box {
            margin: 0;
            table {
              thead, tbody {
                tr {
                  border-bottom: solid 1px #dee6ea;
                  th, td {
                    border: 0;
                    font-weight: 400;
                    text-align: left;
                    padding-left: 20px;
                    color:#99aabb;
                  }
                }
              }
              tbody {
                tr {
                  td {
                    color: #667788;
                    a {
                      color: #03a9f4;
                      margin-right: 15px;
                    }
                  }
                }
              }
            }
          }
        }
      }
      .add-user-box {
        position: absolute;
        top: 30px;
        width: 25%;
        bottom: 0;
        background: #f2f5f6;
        border:1px solid rgba(150,150,150,0.18);
        box-shadow:0 10px 20px 0 rgba(0,0,0,0.14);
        z-index: 11;
        right: -25%;
        opacity: 0;
        .add-user-back {
          background: #fff;
          width: 100%;
          padding: 10px 20px 20px 20px;
          .add-user-form {
            .form-name {
              font-size:12px;
              color:#667788;
              letter-spacing:0;
              line-height:18px;
              text-align:left;
              margin-top: 10px;
              display: block;
            }
            .form-input {
              margin-top: 5px;
              #Dpt-select {
                cursor: pointer;
              }
              .error-msg {
                color: #ed807c;
                margin-bottom: 0;
              }
              input {
                padding-left: 15px;
              }
              input, select {
                width: 100%;
                background:#ffffff;
                border:2px solid #dae4e9;
                border-radius:2px;
                outline: none;
                height: 30px;
                box-sizing: border-box;
                &.error-i {
                  border: 1px solid #ed807c;
                  box-shadow: 0px 0px 3px #ed807c;
                  -webkit-animation: light .3s ease-in-out;
                  animation: light .3s ease-in-out;
                }
              }
              .station-td {
                select {
                  width: 95%;
                }
                &.right {
                  text-align: right;
                  float: none;
                }
              }
            }
          }
          table {
            width: 100%;
            tbody {
              width: 100%;
              tr {
                width: 100%;
                &.form-name {
                  font-size:12px;
                  color:#667788;
                  letter-spacing:0;
                  line-height:18px;
                  text-align:left;
                  margin-top: 10px;
                  display: block;
                }
                &.form-input {
                  margin-top: 5px;
                  .error-msg {
                    color: #ed807c;
                  }
                  input {
                    padding-left: 15px;
                  }
                  input, select {
                    width: 100%;
                    background:#ffffff;
                    border:2px solid #dae4e9;
                    border-radius:2px;
                    outline: none;
                    height: 30px;
                    box-sizing: border-box;
                    &.error-i {
                      border: 1px solid #ed807c;
                      box-shadow: 0px 0px 3px #ed807c;
                      -webkit-animation: light .3s ease-in-out;
                      animation: light .3s ease-in-out;
                    }
                  }
                  .station-td {
                    select {
                      width: 95%;
                    }
                    &.right {
                      text-align: right;
                      float: none;
                    }
                  }
                }
              }
            }
          }
        }
        .user-btn-box {
          .user-btn {
            border-radius:4px;
            width:50%;
            height:30px;
            display: block;
            margin: auto;
            border: 0;
            outline: none;
            font-size:12px;
            cursor: pointer;
            &.add-btn {
              background:#03a9f4;
              color:#ffffff;
              margin-top: 30px;
              &:hover{
                background: #66bb6a;
              }
            }
            &.cancel-user-btn {
              background:#ffffff;
              border:1px solid #e6ecef;
              color:#99aabb;
              margin-top: 15px;
            }
          }
        }
      }
    }
  }
}